<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
    <head>
        <base href="<%=basePath%>">
        <meta charset="UTF-8">
        <title>欢迎</title>
        <link rel="stylesheet" href="static/themes/bootstrap/easyui.css">
        <link rel="stylesheet" href="static/css/base.css">
        <script src="static/javascript/jquery-1.11.3.min.js"></script>
        <script src="static/javascript/jquery.easyui.min.js"></script>
        <script src="static/javascript/utils.js"></script>
        <script src="static/javascript/base.js"></script>
        <link rel="stylesheet" href="plugins/bootstrap-3.3.5-dist/css/bootstrap.min.css">
        <link rel="stylesheet" href="plugins/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css">
        <script src="plugins/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>

        <script type="text/javascript" language="JavaScript">
            $(document).ready(function(){
                var redBalls = "红球选择：";
                redBalls += "<ul id=\"red_balls\">";
                for (var i = 1;i <= 33;i ++){
                    redBalls += "<li>" + i + "</li>";
                }
                redBalls += "</ul>";

                var blueBalls = "篮球选择：";
                blueBalls += "<ul id=\"blue_balls\">";
                for (var i = 1;i <= 16;i ++){
                    blueBalls += "<li>" + i + "</li>";
                }
                blueBalls += "</ul>";

                $("#selectPanel").html(redBalls + "<br/>" + blueBalls);
                $("#selectPanel ul").css("display","inline");

                $("#red_balls li").click(function () {
                    if($(this).hasClass("red_ball")) {
                        $(this).removeClass("red_ball");
                    } else {
                        $(this).addClass("red_ball");
                    }
                });

                $("#blue_balls li").click(function () {
                    if($(this).hasClass("blue_ball")) {
                        $(this).removeClass("blue_ball");
                    } else {
                        $(this).addClass("blue_ball");
                    }
                });

                var funArray = {
                    MainTable: function () {
                        $.mainTableCSS();
                    },
                    ElevenDigitTable: function () {
                        $.elevenDigitTableCSS();
                    },
                    BlueTable: function () {
                        $.blueTableCSS();
                    },
                    EvenTable: function () {
                        $.evenTableCSS();
                    },
                    OddTable: function () {
                        $.oddTableCSS();
                    },
                    FourPart012Table: function () {
                        $.fourPart012TableCSS();
                    },
                    FourPartEnd012Table: function () {
                        $.fourPartEnd012TableCSS();
                    },
                    End3dTable: function () {
                        $.end3dTableCSS();
                    },
                    EndTable: function() {
                        $.endTableCSS();
                    }
                }

                var maxChartDataSize = 30;


                $("#chartDataTabs a").click(function () {
                    var obj=$.ajax({url:"page/restForTableData?tableName=" + $(this).attr("href").substring(1) + "&maxChartDataSize=" +  maxChartDataSize,async:false});
                    var lines = "";
                    var lineArray = obj.responseText.substring(1,obj.responseText.length - 1).split("$");
                    for(var i = 0;i < lineArray.length; i ++){
                        lines += "<tr>";
                        var itemArray = lineArray[i].split(";");
                        for(var j = 0; j < itemArray.length; j ++){
                            lines += "<td>" + itemArray[j] + "</td>";
                        }
                        lines += "</tr>";
                    }

                    var headLine = $($(this).attr("href") + " table tr:first").html();
                    $($(this).attr("href") + " table").html("<tr>" + headLine + "</tr>" + lines);

                    funArray[$(this).attr("href").substring(1)]();
                    $("#chartDataPanel table td").css("min-width","22px");
                    $("#chartDataPanel table").attr("border","1");
                });

                $("#top30").click(function () {
                    maxChartDataSize = 30;
                    $("#topSizePanel button").css("background-color","lightgrey");
                    $(this).css("background-color","skyblue");
                    $("#chartDataTabs").find(".active a").click();
                });
                $("#top50").click(function () {
                    maxChartDataSize = 50;
                    $("#topSizePanel button").css("background-color","lightgrey");
                    $(this).css("background-color","skyblue");
                    $("#chartDataTabs").find(".active a").click();
                });
                $("#top100").click(function () {
                    maxChartDataSize = 100;
                    $("#topSizePanel button").css("background-color","lightgrey");
                    $(this).css("background-color","skyblue");
                    $("#chartDataTabs").find(".active a").click();
                });

                $("#chartDataTabs a").first().click();

            });

        </script>
    </head>
    <body>
        <div>
            <div id="selectPanel"></div>
            <div class="paddingTop">
                <div>
                    <ul class="nav nav-tabs" id="chartDataTabs">
                        <li><a data-toggle="tab" href="#MainTable">主表</a></li>
                        <li><a data-toggle="tab" href="#ElevenDigitTable">十一位数表</a></li>
                        <li><a data-toggle="tab" href="#BlueTable">篮球表</a></li>
                        <li><a data-toggle="tab" href="#EvenTable">偶数表</a></li>
                        <li><a data-toggle="tab" href="#OddTable">奇数表</a></li>
                        <li><a data-toggle="tab" href="#FourPart012Table">四区012</a></li>
                        <li><a data-toggle="tab" href="#FourPartEnd012Table">四区尾012</a></li>
                        <li><a data-toggle="tab" href="#End3dTable">尾3d表</a></li>
                        <li><a data-toggle="tab" href="#EndTable">尾数表</a></li>
                        <li id="topSizePanel" class="topSizePanel">
                            <button id="top30">&lt;30</button>
                            <button id="top50">&lt;50</button>
                            <button id="top100">&lt;100</button>
                        </li>
                    </ul>

                </div>
                <div class="tab-content" id="chartDataPanel">
                    <div class="tab-pane" id="MainTable" title="主表">
                        <table>
                            <tr>
                                <th>期号</th>
                                <th>奇偶</th>
                                <th class="right_blod">和值</th>
                                <th>1</th>
                                <th>2</th>
                                <th>3</th>
                                <th>4</th>
                                <th>5</th>
                                <th>6</th>
                                <th>7</th>
                                <th class="right_blod">8</th>
                                <th>9</th>
                                <th>10</th>
                                <th>11</th>
                                <th class="pink_bg">12</th>
                                <th class="pink_bg">13</th>
                                <th class="pink_bg">14</th>
                                <th class="pink_bg">15</th>
                                <th class="right_blod pink_bg">16</th>
                                <th class="right_blod pink_bg">17</th>
                                <th class="pink_bg">18</th>
                                <th class="pink_bg">19</th>
                                <th class="pink_bg">20</th>
                                <th class="pink_bg">21</th>
                                <th class="pink_bg">22</th>
                                <th>23</th>
                                <th>24</th>
                                <th class="right_blod">25</th>
                                <th>26</th>
                                <th>27</th>
                                <th>28</th>
                                <th>29</th>
                                <th>30</th>
                                <th>31</th>
                                <th>32</th>
                                <th class="right_blod">33</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="ElevenDigitTable" title="十一位数表">
                        <table>


                            <tr>
                                <th class="right_blod">期号</th>
                                <th class="right_blod" colspan="3">1</th>
                                <th class="right_blod" colspan="3">2</th>
                                <th class="right_blod" colspan="3">3</th>
                                <th class="right_blod" colspan="3">4</th>
                                <th class="right_blod" colspan="3">5</th>
                                <th class="right_blod" colspan="3">6</th>
                                <th class="right_blod" colspan="3">7</th>
                                <th class="right_blod" colspan="3">8</th>
                                <th class="right_blod" colspan="3">9</th>
                                <th class="right_blod" colspan="3">10</th>
                                <th class="right_blod" colspan="3">11</th>
                                <th class="right_blod" colspan="11">基本遗漏走势表</th>
                                <th class="right_blod" colspan="3">0路走势</th>
                                <th class="right_blod" colspan="4">1路走势</th>
                                <th class="right_blod" colspan="4">2路走势</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="BlueTable" title="蓝球表">
                        <table>


                            <tr>
                                <th class="right_blod">期号</th>
                                <th>1</th>
                                <th>2</th>
                                <th>3</th>
                                <th class="right_blod">4</th>
                                <th>5</th>
                                <th>6</th>
                                <th>7</th>
                                <th class="right_blod">8</th>
                                <th>9</th>
                                <th>10</th>
                                <th>11</th>
                                <th class="right_blod">12</th>
                                <th>13</th>
                                <th>14</th>
                                <th>15</th>
                                <th class="right_blod">16</th>
                                <th class="right_blod" colspan="8">八位分析</th>
                                <th class="right_blod" colspan="3">八位012表</th>
                                <th class="right_blod" colspan="2">前后区</th>
                                <th class="right_blod" colspan="4">四位分析</th>
                                <th>奇</th>
                                <th class="right_blod">偶</th>
                                <th class="right_blod" colspan="3">八位012表</th>
                                <th class="right_blod" colspan="4">区间分析</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="EvenTable" title="偶数表">
                        <table>


                            <tr>
                                <th>期号</th>
                                <th>奇偶</th>
                                <th class="right_blod">和值</th>
                                <th>2</th>
                                <th>4</th>
                                <th>6</th>
                                <th>8</th>
                                <th>10</th>
                                <th>12</th>
                                <th>14</th>
                                <th class="right_blod">16</th>
                                <th>18</th>
                                <th>20</th>
                                <th>22</th>
                                <th>24</th>
                                <th>26</th>
                                <th>28</th>
                                <th>30</th>
                                <th class="right_blod">32</th>
                                <th class="right_blod" colspan="4">整体表</th>
                                <th colspan="4">前区</th>
                                <th class="right_blod" colspan="4">后区</th>
                                <th class="right_blod" colspan="4">断区遗漏</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="OddTable" title="奇数表">
                        <table>


                            <tr>
                                <th>期号</th>
                                <th>奇偶</th>
                                <th class="right_blod">和值</th>
                                <th>1</th>
                                <th>3</th>
                                <th>5</th>
                                <th>7</th>
                                <th>9</th>
                                <th>11</th>
                                <th>13</th>
                                <th>15</th>
                                <th>17</th>
                                <th>19</th>
                                <th>21</th>
                                <th>23</th>
                                <th>25</th>
                                <th>27</th>
                                <th>29</th>
                                <th>31</th>
                                <th class="right_blod">33</th>
                                <th class="right_blod" colspan="4">整体表</th>
                                <th colspan="4">前区</th>
                                <th class="right_blod" colspan="4">后区</th>
                                <th class="right_blod" colspan="4">断区遗漏</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="FourPart012Table" title="四区012">
                        <table>

                            <tr>
                                <th>期号</th>
                                <th class="right_blod">和值</th>
                                <th>3</th>
                                <th class="right_blod">6</th>
                                <th>1</th>
                                <th>4</th>
                                <th class="right_blod">7</th>
                                <th>2</th>
                                <th>5</th>
                                <th class="right_blod">8</th>
                                <th>9</th>
                                <th>12</th>
                                <th class="right_blod">15</th>
                                <th>11</th>
                                <th>14</th>
                                <th class="right_blod">17</th>
                                <th>10</th>
                                <th>13</th>
                                <th class="right_blod">16</th>
                                <th>18</th>
                                <th>21</th>
                                <th class="right_blod">24</th>
                                <th>19</th>
                                <th>22</th>
                                <th class="right_blod">25</th>
                                <th>20</th>
                                <th class="right_blod">23</th>
                                <th>27</th>
                                <th>30</th>
                                <th class="right_blod">33</th>
                                <th>28</th>
                                <th class="right_blod">31</th>
                                <th>26</th>
                                <th>29</th>
                                <th class="right_blod">32</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="FourPartEnd012Table" title="四区尾012">
                        <table>


                            <tr>
                                <th>期号</th>
                                <th class="right_blod">和值</th>
                                <th>3</th>
                                <th class="right_blod">6</th>
                                <th>1</th>
                                <th>4</th>
                                <th class="right_blod">7</th>
                                <th>2</th>
                                <th>5</th>
                                <th class="right_blod">8</th>
                                <th>9</th>
                                <th>13</th>
                                <th class="right_blod">16</th>
                                <th>10</th>
                                <th>11</th>
                                <th class="right_blod">14</th>
                                <th class="right_blod">17</th>
                                <th>12</th>
                                <th class="right_blod">15</th>
                                <th>19</th>
                                <th class="right_blod">23</th>
                                <th>20</th>
                                <th>21</th>
                                <th class="right_blod">24</th>
                                <th>18</th>
                                <th>22</th>
                                <th class="right_blod">25</th>
                                <th>26</th>
                                <th>29</th>
                                <th class="right_blod">33</th>
                                <th>27</th>
                                <th>30</th>
                                <th class="right_blod">31</th>
                                <th>28</th>
                                <th class="right_blod">32</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="End3dTable" title="尾3d表">
                        <table>


                            <tr>
                                <th class="right_blod">期号</th>
                                <th colspan="6">基本出球</th>
                                <th colspan="6" class="right_blod">尾012路走势</th>
                                <th colspan="3" class="right_blod">尾012比</th>
                                <th colspan="6">尾012路遗漏值</th>
                                <th>3</th>
                                <th>6</th>
                                <th class="right_blod">9</th>
                                <th>13</th>
                                <th>16</th>
                                <th class="right_blod">19</th>
                                <th>23</th>
                                <th>26</th>
                                <th>29</th>
                                <th class="right_blod">33</th>
                                <th>1</th>
                                <th>4</th>
                                <th>7</th>
                                <th class="right_blod">10</th>
                                <th>11</th>
                                <th>14</th>
                                <th>17</th>
                                <th class="right_blod">20</th>
                                <th>21</th>
                                <th>24</th>
                                <th>27</th>
                                <th>30</th>
                                <th class="right_blod">31</th>
                                <th>2</th>
                                <th>5</th>
                                <th class="right_blod">8</th>
                                <th>12</th>
                                <th>15</th>
                                <th class="right_blod">18</th>
                                <th>22</th>
                                <th>25</th>
                                <th>28</th>
                                <th class="right_blod">32</th>
                            </tr>
                        </table>
                    </div>
                    <div class="tab-pane" id="EndTable" title="尾数表">
                        <table>


                            <tr>
                                <th>期号</th>
                                <th class="right_blod">和值</th>
                                <th>1</th>
                                <th>11</th>
                                <th>21</th>
                                <th class="right_blod">31</th>
                                <th>2</th>
                                <th>12</th>
                                <th>22</th>
                                <th class="right_blod">32</th>
                                <th>3</th>
                                <th>13</th>
                                <th>23</th>
                                <th class="right_blod">33</th>
                                <th>4</th>
                                <th>14</th>
                                <th class="right_blod">24</th>
                                <th>5</th>
                                <th>15</th>
                                <th class="right_blod">25</th>
                                <th>6</th>
                                <th>16</th>
                                <th class="right_blod">26</th>
                                <th>7</th>
                                <th>17</th>
                                <th class="right_blod">27</th>
                                <th>8</th>
                                <th>18</th>
                                <th class="right_blod">28</th>
                                <th>9</th>
                                <th>19</th>
                                <th class="right_blod">29</th>
                                <th>10</th>
                                <th>20</th>
                                <th class="right_blod">30</th>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>